<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">

    <title>烟感</title> 
    <link rel="stylesheet" href="/home/css/ui.css">
     <link rel="stylesheet" href="/home/css/index.css">

</head>
<body>


<div class="content" style="overflow: auto;">
    
            {{csrf_field()}}
    <div class="scroll-content">

        <div class="scroll">
          <div class="item-limit-icon item-limit-title">
        <input type="hidden" name="num" value="{{$num}}">
        
            <div> <a href="#" onClick="javascript:history.back(-1);"><img class="back1" style="vertical-align:middle;margin-right: 21rem;" src="/home/images/icon/re.png"/></a>
            </div>
                <img id="tu" src="/home/images/1.png"/>
                <div class="box">
                    <div class="slider" id="slider" style="@if($data['status'] == 0) left:0px @else left:100px @endif">
                   
                    </div>
                    <span class="an m">布防</span>
                    <span class="an w">撤防</span>
                </div>
                <h3 style="line-height: 2px;">当前状态</h3>
            </div>
            <div class="item-mark-text b-line">
                <li class="r-line">
                    <p class="item-mark-top">温度</p>
                    <p class="item-mark-bot">25℃</p>
                </li>
                <li class="r-line">
                    <p class="item-mark-top">浓度</p>
                    <p class="item-mark-bot">正常</p>
                </li>
                <li>
                    <p class="item-mark-top">报警</p>
                    <p class="item-mark-bot">正常</p>
                </li>
            </div>
        </div>
    </div>
</div>
</body>
<script src="/home/js/jquery.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
     $('#slider').on('click', function(){
            var left = $(this).css('left');
            if(left == '0px'){
                var state = 1;
            }else{
                var state = 0;
            }
            $.ajax({
                type:'post',
                url:'/home/smoke/bind',
                data:{
                    '_token':$('input[name=_token]').val(),
                    'num':$('input[name=num]').val(),
                    'status':state
                },
                dataType:'json',
                success:function(data){
                    if(data.status == 1){
                        if(left == '0px'){
                            $('#slider').css("left","100px");
                        }else{
                            $('#slider').css("left","0");
                        }

                    }
                    
                }
            })
        })
</script>
</html>